<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<title>发布图片</title>
	<meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no">
	<meta name="apple-mobile-web-app-capable" content="yes">
	<meta name="apple-mobile-web-app-status-bar-style" content="black">
	<meta name="format-detection" content="telephone=no">
	<link rel="stylesheet" type="text/css" href="/Public/Weixin/css/common.css">
</head>
<body>
<p>最多可添加9张作品</p>
<input type="file" id="uploadphoto" name="uploadfile" value="请点击上传图片"   style="display:none;" />
<div class="imglist"></div>
<input type="hidden" id="img_str" name="img_str">
<a id="upload_button" href="javascript:void(0);" class="uploadImage uploadbtn"><img src="/Public/Weixin/images/upload-add.png" alt=""></a>
<div class="sb">发布</div>
<script type="text/javascript" src="/Public/Weixin/js/jquery.min.js"></script>
<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script>
	wx.config({
		debug: false,
		appId: '{$signPackage["appid"]}',
		timestamp: {$signPackage["timestamp"]},
		nonceStr: '{$signPackage["noncestr"]}',
		signature: '{$signPackage["signature"]}',
		jsApiList: [
// 所有要调用的 API 都要加到这个列表中
			'chooseImage','previewImage','uploadImage','downloadImage'
		]
	});
	wx.ready(function () {
// 5.3 上传图片
		$('.uploadImage').on('click', function () {
			wx.chooseImage({
				success: function (res) {
					var localIds = res.localIds;
					syncUpload(localIds);
				}
			});
		});
		var syncUpload = function(localIds){
			var localId = localIds.pop();
			wx.uploadImage({
				localId: localId,
				isShowProgressTips: 1,
				success: function (res) {
					var serverId = res.serverId; // 返回图片的服务器端ID
					var str = $('#img_str').val()+serverId+',';
					$('.imglist').append("<img src='"+localId+"' />");
					$('#img_str').val(str);
					//其他对serverId做处理的代码
					if(localIds.length > 0){
						syncUpload(localIds);
					}
					if($('.imglist img').size() >= 9) {
						$("#upload_button").hide();
					}
				},
				fail: function (res) { alert(JSON.stringify(res)); }
			});
		};
	});
</script>

<script>

	$(".sb").click(function(){
		var imglist = $(".imglist").html();

		if(imglist == "" || imglist == null) {
			alert("请添加图片");
			return false;
		} else {
			if($(".imglist").find('img').size() >9) {
				alert("图片只允许上传9张！");
				return false;
			}
			var img_str = $('#img_str').val();
		}

		$.post("{:U('Test/wxupload')}", {img_str:img_str},function(data){
			window.location.href = "__URL__/test";
		});
	});

</script>

<script>
	// 微信配置
	var token="{$token}";
	var timestamp="{$timestamp}";
	var wxnonceStr = "{$wxnonceStr}";
	var wxshal = "{$wxshal}";
	wx.config({
		debug: false,
		appId: "wx978a1c1edb5fea34",
		timestamp: "{$timestamp}",
		nonceStr: "{$wxnonceStr}",
		signature: "{$wxshal}",
		jsApiList: ['onMenuShareAppMessage', 'onMenuShareTimeline','chooseImage','previewImage','uploadImage','downloadImage'] // 功能列表，我们要使用JS-SDK的什么功能
	});
	var serverids=[];
	var leng=0;
	var syncUpload = function(localIds){
		myApp.hidePreloader();
		myApp.showPreloader();
		var localId = localIds.pop();
		wx.uploadImage({
			localId: localId,
			isShowProgressTips:0,
			success: function (res) {
				var serverId = res.serverId; // 返回图片的服务器端ID
				serverids.push(serverId);
				//其他对serverId做处理的代码
				if(localIds.length > 0){
					syncUpload(localIds);
				}
				if(leng==serverids.length){
					var json = {};
					for(var i=0;i<serverids.length;i++)
					{
						json[i]=serverids[i];
					}
					var serids=JSON.stringify(json);
					$.ajax({
						type : "post",
						url : "/WebApp/Live/downloadMedia",
						data : {mediaid:serids} ,
						dataType:"json",
						async : false,
						success : function(response){
							myApp.hidePreloader();
							$.each(response.image,function (k,v) {
								var contentUl = SetImgBox(v);
								$(".img_box").append(contentUl);
							})
							myApp.hidePreloader();
							alert("上传成功!");
							//alert(response.image[0])
							//$(".ago").attr("src",response.image[0])
						}
					});
				}
			}
		});
	};
	$(function () {
		wx.ready(function () {
			// 获取“分享到朋友圈”按钮点击状态及自定义分享内容接口
			$("#contentid").click(function () {
				var ileng=$("#imglength li").length;
				var wleng=9+1-ileng;
				var that = $(this);
				wx.chooseImage({
					count: wleng, // 默认9
					sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
					success: function (res) {
						var localIds = res.localIds; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
						leng = localIds.length;
						syncUpload(localIds); //上传代码图片就在此直接调用
					}
				});
			})
		})
	})
</script>
</body>
</html>